<template>
    <ul>
        <li class="recentArticles" v-for="item in essayInfo">
            <router-link
                :to="{name:'detail',params:{id:item.wid}}"
                 @click="essayInfoes(item,$event)"
            >{{item.title}}</router-link>
            <img src="/img/common/lianjie.png" alt="" ></li>
    </ul>

</template>

<script>
export default {
    name: "",
    props:['essayInfo'],
    mounted() {

    },
    methods:{
        essayInfoes(item,e){
            window.localStorage.setItem("essayInfo",JSON.stringify(item));
            this.$router.replace({path:'/blank'});

        }
    }

}
</script>

<style scoped>


.recentArticles li{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
 .recentArticles li a{
    width: 100%;
    max-width: 13vw;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
    font-size: 0.9rem;
    padding: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all .3s;
     color: white;
}
.recentArticles li a:hover{
    text-decoration: none;
    color: #3586f1 !important;
    transform: scale(1.06);
}

li img{
    width: 1.3rem;
}
</style>